<br />
<h2>Manage Your Family:  "<?php echo $current_family_name; ?>"</h2>
<br />

<script type="text/javascript">
	$j(function() {
		function isValidEmail(emailAddress) {
			var pattern = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
			return pattern.test(emailAddress);
		}

		$j( "#manage-family-add-user-button-add-users" ).button({ 
			label: 'Add users to this family',
			disabled: false
		});
		
		$j( "#manage-family-submit-changes" ).button({ 
			label: 'Save changes to this family',
			disabled: false
		});

		$j( "#manage-family-add-user-button-add-users" ).click(function() {
			if ($j( "#manage-family-add-user-textarea-add-users" ).val().trim() == '') {
				alert("No email entered");
				return false;
			}
	
			var emails = $j( "#manage-family-add-user-textarea-add-users" ).val().trim().split(',');
			var invalid_emails = '';
			var duplicate_emails = '';

			for (i = 0; i < emails.length; i++) {
				// check for empty element (i.e. no content between 2 commas or after the last comma)
				if (emails[i].trim() == '') { continue; }

				// check for valid email
				if (!isValidEmail(emails[i].trim())) {
					invalid_emails += emails[i].trim() + ',';
					continue;
				}

				// check for duplicate emails
				var duplicate = false;		
				var duplicate_pos = -1;	

				$j('.manage-family-user-list-email').each(function(index) {
					if ($j(this).text().trim() == emails[i].trim()) { 
						duplicate = true; 
						duplicate_pos = index + 1;
						return false; 
					}
				});

				if (duplicate) { 
					duplicate_emails += emails[i].trim() + ',';
					continue;
				}

				// check that email is not the same as to the email of the current admin user
				if (emails[i].trim() == "<?php echo $current_admin['username']; ?>") {
					duplicate_emails += emails[i].trim() + ',';
					continue;
				}

				// add to user display list
				var html = 
					'<li class="manage-family-user-list-li">' + 
						'<div class="manage-family-user-list-entry">' +
							'<strong>Name: </strong><br /\>' +
							'<strong>Username: </strong><span class="manage-family-user-list-email">' + emails[i] + '</span>' +
						'</div>' + 
						'<a class="manage-family-user-list-make-admin" href="#">Make admin</a><br /\>' + 
						'<a class="manage-family-user-list-remove-family clear" href="#">remove</a>' + 
					'</li>';

				$j( '#manage-family-user-list-ol' ).append(html);

				
				initializeMakeAdminLinks();
				initializeRemoveAdminAccessLinks();
				initializeRemoveLinks();
			
			
				// add hidden field

				// add hidden field to submit form
				$j('#mangage-family-save-form').append('<input type="hidden" name="' + emails[i].trim() + '" value="0" /\>');
			}

			var alert_text = ((invalid_emails == '') ? '' : 'Invalid email addresses: ' + invalid_emails + '\n') +
				   			 ((duplicate_emails == '') ? '' : 'Users already in this family: ' + duplicate_emails);

			if (alert_text.trim() != '') {
				alert(alert_text);
			}

			// on succesfull user addition enable the save button
			//$j( "#manage-family-submit-changes" ).button('enable');
			$j( "#manage-family-add-user-textarea-add-users" ).val('');
		});

		$j( "#manage-family-submit-changes" ).click(function() {
		
		});
		
		/*
		$j( "#manage-family-add-user-textarea-add-users" ).change(function() {
			if ($j(this).val().trim() == '') {
				$j( "#manage-family-add-user-button-add-users" ).button('disable');
			}
			else {
				$j( "#manage-family-add-user-button-add-users" ).button('enable');
			}
		});
		*/

		function initializeMakeAdminLinks() {
			$j('.manage-family-user-list-make-admin').each(function() {
				$j(this).click(function() {
					// update display for admin link
					$j(this).html('Remove admin access');

					// update class for admin link
					$j(this).removeClass('manage-family-user-list-make-admin');
					$j(this).addClass('manage-family-user-list-remove-admin-access');

					// refresh RemoveAdminAccess links
					initializeRemoveAdminAccessLinks();

					// update the corresponding form hidden field
					$j('input[name="' + 
						$j(this).siblings().children('.manage-family-user-list-email').text().trim() +
						'"]').val('1');
					
					// prevent following the link
					return false;
				});
			});
		}

		function initializeRemoveAdminAccessLinks() {
			$j('.manage-family-user-list-remove-admin-access').each(function() {
				$j(this).click(function() {
					// update display for admin link
					$j(this).html('Make admin');

					// update class for admin link
					$j(this).removeClass('manage-family-user-list-remove-admin-access');
					$j(this).addClass('manage-family-user-list-make-admin');

					// refresh RemoveAdminAccess links
					initializeMakeAdminLinks();

					// update the corresponding form hidden field
					$j('input[name="' + 
						$j(this).siblings().children('.manage-family-user-list-email').text().trim() +
						'"]').val('0');
					
					// prevent following the link
					return false;
				});
			});
		}

		function initializeRemoveLinks() {
			$j('.manage-family-user-list-remove-family').each(function() {
				$j(this).click(function() {
					// remove the li element 
					$j(this).parent().remove();

					// remove the corresponding form hidden field
					$j('input[name="' + 
						$j(this).siblings().children('.manage-family-user-list-email').text().trim() +
						'"]').remove();
					
					// prevent following the link
					return false;
				});
			});
		}

		initializeMakeAdminLinks();
		initializeRemoveAdminAccessLinks();
		initializeRemoveLinks();
		
	});


</script>

<div id="manage-family-wrapper"> <!-- BEGIN MAIN WRAPPER -->
<p>Users in this family beside yourself (You are currently logged in as 
	<strong><?php echo $current_admin['username']; ?></strong>):
</p>

<div id="manage-family-user-list-wrapper"> <!-- BEGIN WRAPPER -->
	
	<div id="manage-family-user-list-container">
		<ol id="manage-family-user-list-ol"><?php 
		$i = 0;
		foreach ($users as $user): 
			// don't display the current admin in the list
			if ($user['id'] != $current_admin['id']) { ?>
			<li class="manage-family-user-list-li">								
				<div class="manage-family-user-list-entry">
					<strong>Name: </strong><?php echo $user['first_name'].' '.$user['last_name']; ?><br />
					<strong>Username: </strong><span class="manage-family-user-list-email"><?php echo $user['username']; ?></span>
				</div>
				<?php if ($family_user_admin_status[$user['id']] == 1) { ?>
					<a class="manage-family-user-list-remove-admin-access" href="#">Remove admin access</a>
				<?php } else { ?>
					<a class="manage-family-user-list-make-admin" href="#">Make admin</a>
				<?php } ?><br />
				<a class="manage-family-user-list-remove-family clear" href="#">remove</a>
			</li><?php
			$i++;
			}			
		endforeach; ?>
		</ol>
	</div>

</div> <!-- END WRAPPER -->


<div id="manage-family-add-user-wrapper"> <!-- BEGIN WRAPPER -->
	<div id="share_with_families_add_container">
		<label for="tags">Add users (comma separated list of email addresses):</label><br />
		<textarea id="manage-family-add-user-textarea-add-users"></textarea>
		<input id="manage-family-add-user-button-add-users" type="submit" />
	</div>

</div> <!-- END WRAPPER -->


<div>
	<form id="mangage-family-save-form" action="<?php echo $html->url('/families/updatefamily/family:' . $current_family_id); ?>" method="POST">
		<input id="manage-family-submit-changes" type="submit" />
		<?php 
		foreach ($users as $user): 
			if ($user['id'] != $current_admin['id']) { 
				// email/admin status pairs
			?>
				<input type="hidden" 
					   name="<?php echo $user['username']; ?>" 
					   value="<?php echo $family_user_admin_status[$user['id']]; ?>" /><?php	
			}
		endforeach; ?>
	</form>
</div>

</div> <!-- END MAIN WRAPPER -->
